import * as THREE from '../../build/three.module.js';
import {
  OrbitControls
} from '../../jsm/controls/OrbitControls.js';

// 创建一个立方体几何体
let boxGeo = new THREE.BoxGeometry(100, 100, 100);
console.log(boxGeo);
console.log('几何体顶点位置数据', boxGeo.vertices);
console.log('三角面数据', boxGeo.faces);

//创建一个矩形平面几何体
var geometry = new THREE.PlaneBufferGeometry(100, 100);
console.log(geometry);
console.log('几何体顶点位置数据',geometry.attributes.position);
console.log('几何体索引数据',geometry.index);

let scene = new THREE.Scene();

// 设置每个面的顶点颜色
boxGeo.faces.forEach(face => {
  face.vertexColors = [
    new THREE.Color(0xffff00),
    new THREE.Color(0xff00ff),
    new THREE.Color(0x00ffff),
  ]
});

let mat = new THREE.MeshBasicMaterial({
  vertexColors: THREE.VertexColors
});
let mesh = new THREE.Mesh(boxGeo, mat);
scene.add(mesh);

let k = innerWidth / innerHeight,
    s = 200,
    camera = new THREE.OrthographicCamera(-s * k, s * k, s, -s, 1, 1000);
camera.position.set(400, 400, 400);
camera.lookAt(scene.position);

let renderer = new THREE.WebGLRenderer();
renderer.setSize(innerWidth, innerHeight);
renderer.setClearColor(0xeeeeee);
document.body.appendChild(renderer.domElement);

new OrbitControls(camera, renderer.domElement);

function render () {
  requestAnimationFrame(render);
  renderer.render(scene, camera);
}
render();